<template>
	<view class="define-template flex-column flex-column-100">
		<qh-navbar :title="storeName" bgColor="var(--primary-color)" color="#fff"></qh-navbar>
		<!-- 选择门店、搜索商品、扫码、付款码 -->
		<view class="home-top flex-cn">
			<text class="qh-rt-single qh-rt-weizhi2 home-map-icon" :class="{'new-index': peopleIndex == 1}" @tap="goStoreAddress"></text>
			<view class="home-store-picker" :class="{'new-index': peopleIndex == 2}">
				<view class="home-picker" @tap="toStoreLocation">
					<text class="home-picker-text">{{storeName}}</text>
					<text class="qh-rt-single qh-rt-a-zu44101 home-picker-icon" v-if="store_switch == 1"></text>
				</view>
			</view>
			<view class="home-search flex-cn" @tap="search">
				<text class="qh-rt-single qh-rt-a-zu2432 search-icon"></text>
				<text>请输入商品名称</text>
			</view>
			<view class="home-scan-box">
				<text class="qh-rt-single qh-rt-a-zu4486 home-scan-icon" :class="{'new-index': peopleIndex == 3}" @tap="scavenging"></text>
				<text class="qh-rt-single qh-rt-a-zu4460 home-scan-icon" :class="{'new-index': peopleIndex == 4}" @tap="toCard"></text>
			</view>
		</view>

		<view class="home-box flex-column-100 tabbar-page-bottom" v-if="storeList.length > 0">
			<view class="width-height-100">
				<qh-scroll-view parent-el-name=".home-box" @init="initScroll" @scrolltolower="getRecommend" :lower-triggered="isLoading" refresher-enabled
					@refresherrefresh="onPagePullDownRefresh" :refresher-triggered="isRefresh" refresher-background="var(--primary-color)">

					<!-- banner图 -->
					<view class="home-banner" v-if="imgUrls.length>0">
						<text class="qh-rt-single qh-rt-a-zu4457 home-top-bg-icon"></text>
						<swiper class="home-swiper" autoplay="true" :interval="3000" :duration="1000" circular="true">
							<block v-for="(item, index) in imgUrls" :key="index">
								<swiper-item>
									<image mode="aspectFit" :src="item.img_url" @tap="toImgUrl(item.url)"></image>
								</swiper-item>
							</block>
						</swiper>
					</view>

					<!-- #ifdef MP-WEIXIN -->
					<!-- 直播 -->
					<view class="home-act-list" v-if="liveList">
						<view class="liveInfo">
							<view class="anchorInfo" @tap="toLive">
								<image :src="liveList.share_img" mode="aspectFill" class="anchorImg"></image>
								<text class="anchorName">{{liveList.anchor_name}}</text>
								<image src="/static/images/live.png" class="liveStatus" v-if="liveList.live_status==101">
								</image>
								<view class="beforeLive" v-if="liveList.live_status==102">
									<text style="font-size:24rpx;color:white">预 播</text>
								</view>
							</view>
							<view class="liveMore">
								<text class="liveText" @tap="seeMoreAnchor">查看更多</text>
								<image class="rightIcon" src="/static/images/right.png"></image>
							</view>
						</view>
					</view>
					<!-- #endif -->

					<!-- 门店优惠券 -->
					<view class="home-coupon" v-if="couponList.length>0">
						<block v-for="(item, index) in couponList" :key="index">
							<view class="home-coupon-item">
								<text class="qh-rt-single qh-rt-youhuiquan home-coupon-item-icon" style="color:var(--primary-color);font-size: 100rpx;"></text>
								<view class="home-coupon-con">
									<view class="home-coupon-left">
										<text>￥</text>
										<text>{{item.reduce_money}}</text>
									</view>
									<view class="home-coupon-right">
										<text class="home-coupon-right-t1">{{item.coupon_name}}</text>
										<text class='home-coupon-right-t2'>满{{item.need_money}}减{{item.reduce_money}}</text>
										<text class='home-coupon-right-t3'>{{item.begin_time}}-{{item.end_time}}</text>
										<view v-if="!item.use" class="home-coupon-btn" @tap="receiveCoupon(index)">
											领取</view>
										<view v-else class="home-coupon-btn home-coupon-btn-disable">已领取</view>
									</view>
								</view>
							</view>
						</block>
						<!--  -->
						<view class="home-coupon-more" v-if="couponList.length==3">
							<view @tap="coupon">
								<image src="/static/images/solid-arrow-2.png"></image>
								<text>查看更多</text>
							</view>
						</view>
					</view>
					<!-- #ifdef MP-ALIPAY -->
					<!-- 支付宝支付券 -->
					<mkt v-if="canIUse && cityCode" mode="AUTOMATIC" boothCode="MERCHANT_SELF_TINYAPP" :cityCode="cityCode" version="2" />
					<!-- #endif -->

					<!-- #ifdef MP-WEIXIN -->
					<!-- 微信商家券 -->
					<view class="home-coupon" v-if="mercouponList.length>0">
						<block v-for="(item, index) in mercouponList" :key="index">
							<view class="home-coupon-item">
								<text class="qh-rt-single qh-rt-shangjiaquan home-coupon-item-icon" style="color:#3fd8a3;font-size: 100rpx;"></text>
								<view class="home-coupon-con" @tap="toCouponDetail(item.id,item.isget,3)">
									<view class="home-coupon-left" :data-id="item.id">
										<text>￥</text>
										<text>{{item.discount_amount}}</text>
									</view>
									<view class="home-coupon-right" @tap.stop="getcouponid(index)">
										<view style="display: flex;flex-direction: row;justify-content: flex-start;">
											<view class="home-coupon-left-icon">
												<text v-if="item.available_type == 1">线上用</text>
												<text v-else-if="item.available_type == 2">线下用</text>
												<text v-else>通用</text>
											</view>
											<text class="home-coupon-right-t1">{{item.stock_name}}</text>
										</view>
										<text class="home-coupon-right-t2">满{{item.transaction_minimum}}减{{item.discount_amount}}</text>
										<text class="home-coupon-right-t3">{{item.available_begin_time | getdate}}-{{item.available_end_time | getdate}}</text>
										<block
											v-if="(service_status == 2 && item.user_type == 2) || (item.user_type == 1 && item.type == 2  && ordinary_status  == 1)">
											<view class="home-coupon-btn" style="color: #23D295" @tap="showAccount(item.user_type)">领取</view>
										</block>
										<block v-else>
											<send-coupon @customevent="getcoupons" :send_coupon_params="item.send_coupon_param" :sign="item.sign"
												:send_coupon_merchant="item.send_coupon_merchant">
												<view class="home-coupon-btn" style="color:#23D295" v-if="!item.isget">领取</view>
												<view class="home-coupon-btn" v-if="item.isget" style="color: #999">已领取</view>
											</send-coupon>
										</block>
									</view>
								</view>
							</view>
						</block>

						<view class="home-coupon-more" v-if="mercouponList.length==3">
							<view @tap="coupon">
								<image src="/static/images/solid-arrow-2.png"></image>
								<text>查看更多</text>
							</view>
						</view>
					</view>

					<!-- 微信代金券 -->
					<view class="home-coupon" v-if="pay_coupon.length>0">
						<block v-for="(item, index) in pay_coupon" :key="index">
							<view class="home-coupon-item">
								<text class="qh-rt-single qh-rt-daijinquan-03 home-coupon-item-icon" style="color:#23d2c8;font-size: 100rpx;"></text>
								<view class="home-coupon-con" @tap="toCouponDetail(item.id,item.isget,4)">
									<view class="home-coupon-left">
										<text>￥</text>
										<text>{{item.coupon_amount}}</text>
									</view>
									<view class="home-coupon-right">
										<text class="home-coupon-right-t1">{{item.stock_name}}</text>
										<text class='home-coupon-right-t2'>满{{item.transaction_minimum}}使用</text>
										<text class='home-coupon-right-t3'>{{item.time}}</text>
										<block
											v-if="(service_status == 2 && item.user_type == 2) || (item.user_type == 1 && item.type == 2  && ordinary_status  == 1)">
											<view class="home-coupon-btn" style="color: #23d2c8" @tap.stop="showAccount(item.user_type)">领取</view>
										</block>
										<block v-else>
											<view class="home-coupon-btn" style="color: #23d2c8" v-if="!item.isget" @tap.stop="receivePayCoupon(index)">领取
											</view>
											<view class="home-coupon-btn" style="color: #BBBBBB" v-else>已领取</view>
										</block>
									</view>
								</view>
							</view>
						</block>
						<view class="home-coupon-more" v-if="pay_coupon.length==3">
							<view @tap="coupon">
								<image src="/static/images/solid-arrow-2.png"></image>
								<text>查看更多</text>
							</view>
						</view>
					</view>
					<!-- #endif -->

					<!-- 导航栏 -->
					<view class="home-nav" v-if="navigation.length">
						<view class="home-nav-list" v-for="(item, index) in navigation" :key="index" @tap="toNavigation(item.url)">
							<image :src="item.icon"></image>
							<text>{{item.title}}</text>
						</view>
					</view>
					<!-- 拼团、秒杀、礼品卡 -->
					<block v-if="act_count>0">
						<!-- 秒杀 -->
						<!-- 预售 -->
						<view class="home-act-list" v-if="advance_list.length>0">
							<view class="home-act-list-left">
								<view class="home-act-list-title-box">
									<text class="home-act-list-title">预售</text>
									<view class="home-act-list-tag">超值预售</view>
								</view>
								<text class="home-act-list-left-tips">开启预售之旅</text>
								<view class="home-act-list-btn" @tap="toAdvance">
									<text>查看更多</text>
									<text class="qh-rt-single qh-rt-you home-act-list-btn-icon"></text>
								</view>
							</view>
							<block v-for="(item, index) in advance_list" :key="index">
								<view v-if="item.goods_id>0" class="home-act-list-item" @tap="toAdvanceDetail(item.goods_id)">
									<view class="home-act-list-item-img">
										<image mode="aspectFill" :src="item.image"></image>
									</view>
									<view class="home-act-list-item-price">￥{{item.advance_price}}</view>
								</view>
								<view v-else class="home-act-list-item">
									<view class="home-act-list-item-img home-empty-goods">期待更多好货</view>
									<view class="home-act-list-item-price"></view>
								</view>
							</block>
						</view>
						<!-- 秒杀 -->
						<view class="home-act-list" v-if="seckill_list.length>0">
							<view class="home-act-list-left">
								<view class="home-act-list-title-box">
									<text class="home-act-list-title">秒杀</text>
									<view v-if="seckillTimeArr[0]==0" class="home-act-list-time-box">
										<view class="home-act-list-time">{{seckillTimeArr[1]}}</view>
										<text>:</text>
										<view class="home-act-list-time">{{seckillTimeArr[2]}}</view>
										<text>:</text>
										<view class="home-act-list-time">{{seckillTimeArr[3]}}</view>
									</view>
								</view>
								<view v-if="seckillTimeArr[0]>0" class="home-act-list-time-his-con">
									<view class="home-act-list-time-day">{{seckillTimeArr[0]}}天</view>
									<view class="home-act-list-time-his-box">
										<view class="home-act-list-time-his">{{seckillTimeArr[1]}}</view>
										<text>:</text>
										<view class="home-act-list-time-his">{{seckillTimeArr[2]}}</view>
										<text>:</text>
										<view class="home-act-list-time-his">{{seckillTimeArr[3]}}</view>
									</view>
								</view>
								<text class="home-act-list-left-tips">秒杀专区超值购</text>
								<view class="home-act-list-btn" @tap="toSeckill" :style="seckillTimeArr[0]>0?'margin-top: 16rpx':''">
									<text>查看更多</text>
									<text class="qh-rt-single qh-rt-you home-act-list-btn-icon"></text>
								</view>
							</view>
							<block v-for="(item, index) in seckill_list" :key="index">
								<view v-if="item.id>0" class="home-act-list-item" @tap="toSeckilldetail(item.id)">
									<view class="home-act-list-item-img">
										<image mode="aspectFill" :src="item.image"></image>
									</view>
									<view class="home-act-list-item-price">￥{{item.spike_price}}</view>
								</view>
								<view v-else class="home-act-list-item">
									<view class="home-act-list-item-img home-empty-goods">期待更多好货</view>
									<view class="home-act-list-item-price"></view>
								</view>
							</block>
						</view>
						<!-- 拼团 -->
						<view class="home-act-list" v-if="group_list.length>0">
							<view class="home-act-list-left">
								<view class="home-act-list-title-box">
									<text class="home-act-list-title">拼团</text>
									<view class="home-act-list-tag">限时抢购</view>
								</view>
								<text class="home-act-list-left-tips">拼团专享超低价</text>
								<view class="home-act-list-btn" @tap="toGroup">
									<text>查看更多</text>
									<text class="qh-rt-single qh-rt-you home-act-list-btn-icon"></text>
								</view>
							</view>
							<block v-for="(item, index) in group_list" :key="index">
								<view v-if="item.id>0" class="home-act-list-item" @tap="toGroupdetail(item.id)">
									<view class="home-act-list-item-img">
										<image mode="aspectFill" :src="item.image"></image>
									</view>
									<view class="home-act-list-item-price">￥{{item.act_price}}</view>
								</view>
								<view v-else class="home-act-list-item">
									<view class="home-act-list-item-img home-empty-goods">期待更多好货</view>
									<view class="home-act-list-item-price"></view>
								</view>
							</block>
						</view>
						<!-- 礼品卡 -->
						<view class="home-act-list" v-if="gift_card_list.length>0">
							<view class="home-act-list-left">
								<view class="home-act-list-title-box">
									<text class="home-act-list-title">礼品卡</text>
								</view>
								<text class="home-act-list-left-tips">多种礼品卡任您选择</text>
								<view class="home-act-list-btn" style="margin-top:20rpx;" @tap="toGiftCard">
									<text>查看更多</text>
									<text class="qh-rt-single qh-rt-you home-act-list-btn-icon"></text>
								</view>
							</view>
							<block v-for="(item, index) in gift_card_list" :key="index">
								<view v-if="item.id>0" class="home-act-list-big-item" @tap="toGiftdetail(item.id)">
									<view class="home-act-list-item-img">
										<image mode="aspectFill" :src="item.img_url"></image>
									</view>
								</view>
								<view v-else class="home-act-list-big-item">
									<view class="home-act-list-item-img home-empty-goods">期待更多好货</view>
								</view>
							</block>
						</view>
						<!-- </block> -->
					</block>
					<!-- 促销商品 -->
					<view class="home-act-list home-act-promotion" v-if="promotion.length > 0">
						<view class="home-act-list-left">
							<view class="home-act-list-title-box">
								<text class="home-act-list-title">促销</text>
								<view class="home-act-list-tag">促销活动</view>
							</view>
							<text class="home-act-list-left-tips">优惠大放送</text>
							<view class="home-act-list-btn" @tap="toPromotion">
								<text>查看更多</text>
								<text class="qh-rt-single qh-rt-you home-act-list-btn-icon"></text>
							</view>
						</view>
						<block v-for="(item, index) in promotion" :key="index">
							<view v-if="item.id>0" class="home-act-list-item" @tap="details(item.goods_id)">
								<view class="home-act-list-item-img">
									<image mode="aspectFill" :src="item.goods_image"></image>
								</view>
								<view class="home-act-list-item-price">￥{{item.act_price}}</view>
							</view>
							<view v-else class="home-act-list-item">
								<view class="home-act-list-item-img home-empty-goods">期待更多好货</view>
								<view class="home-act-list-item-price"></view>
							</view>
						</block>
					</view>

					<!-- 最新商品 -->
					<view class="home-nomoral" v-if="newGoodsList && newGoodsList.length">
						<view class="home-nomoral-title-box">
							<view class="home-nomoral-title">最新商品</view>
							<view class="home-nomoral-more" @tap="toNewGoods">
								<text>查看更多</text>
								<image src="/static/images/arrow.png"></image>
							</view>
						</view>
						<view class="home-nomoral-list-box">
							<view class="home-nomoral-list" v-for="(item, index) in newGoodsList" :key="index" @tap.stop="details(item.goods_id)">
								<view class="home-nomoral-list-img">
									<image mode="aspectFill" :src="item.goods_image"></image>
								</view>
								<view class="home-nomoral-list-name">{{item.goods_name}}</view>
								<view v-if="item.promotion_status==1" class="home-nomoral-list-price">{{item.act_price}}</view>
								<block v-else>
									<view v-if="showPlusPrice(item)" class="home-nomoral-list-price flex-cn">
										<text class="plus-price-color">￥{{item.plus_price}}</text>
										<text class="plus-price-icon">PLUS</text>
									</view>
									<view v-if="showVipPrice(item)" class="home-nomoral-list-price flex-cn">
										<text class="price-color">￥{{item.shop_mem_price}}</text>
										<text class="vip-price-icon">VIP</text>
									</view>
									<view v-if="showOnlinePrice(item)" class="home-nomoral-list-price">￥{{item.online_price}}
									</view>
								</block>
								<!-- <view class="commission" v-if="item.disStoreProp && item.disStoreProp!='0.00'">预估收益 <text style="color:#ff3d3d;">￥{{item.disStoreProp}}</text></view> -->
							</view>
						</view>
					</view>

					<!-- 魔方 -->
					<view v-for="(item, index) in magic" :key="index" class="home-nomoral">
						<view class="home-nomoral-title-box">
							<view class="home-nomoral-title">{{item.title}}</view>
						</view>
						<image class="home-magic-box-img" mode="aspectFit" :src="item.child_img" @tap="toMagicDetail(item.url)"></image>
						<view v-if="item.magic_type==1" class="home-magic-list">
							<image lazy-load="true" :src="item.child_img_1" mode="aspectFit" @tap="toMagicDetail(item.url_1)"></image>
							<image lazy-load="true" :src="item.child_img_2" mode="aspectFit" @tap="toMagicDetail(item.url_2)"></image>
							<image lazy-load="true" :src="item.child_img_3" mode="aspectFit" @tap="toMagicDetail(item.url_3)"></image>
						</view>
					</view>

					<!-- 推荐商品 -->
					<view v-if="recommendList.length>0" class="home-recommend">
						<view class="home-nomoral-title-box">
							<view class="home-nomoral-title">商家推荐</view>
							<view class="home-nomoral-more" @tap="productList">
								<text>查看更多</text>
								<image src="/static/images/arrow.png"></image>
							</view>
						</view>
						<view class="home-recommend-tips" style="margin-left:30rpx;font-size=">各类精美商品随心选</view>
						<view class="home-recommend-list-box">
							<view class="home-recommend-list" v-for="(item, index) in recommendList" :key="index" @tap.stop="details(item.goods_id)">
								<view class="home-recommend-list-img">
									<view v-if="item.goods_num<=0" class="goods-sell-empty">已售空</view>
									<image mode="aspectFit" lazy-load="true" :src="item.goods_image"></image>
								</view>
								<view class="home-nomoral-list-name home-recommend-padding">{{item.goods_name}}</view>
								<view v-if="item.promotion_status==1" class="home-recommend-price">￥{{item.act_price}}</view>
								<block v-else>
									<view class="home-recommend-price flex-cn" v-if="showPlusPrice(item)">
										<text class="plus-price-color">￥{{item.plus_price}}</text>
										<text class="plus-price-icon">PLUS</text>
									</view>
									<view v-if="showVipPrice(item)" class="home-recommend-price flex-cn">
										<text class="price-color">￥{{item.shop_mem_price}}</text>
										<text class="vip-price-icon">VIP</text>
									</view>
									<view v-if="showOnlinePrice(item)" class="home-recommend-price">￥{{item.online_price}}
									</view>
								</block>
								<view class="commission" v-if="item.disStoreProp && item.disStoreProp!='0.00'">预估收益 <text
										style="color:#ff3d3d;">￥{{item.disStoreProp}}</text></view>
								<text class="qh-rt-single qh-rt-a-zu4415 home-recommend-list-icon" @tap.stop="addToCar(index)"></text>
							</view>
						</view>
					</view>
					<view class="flex-col-cn-cn">
						<qh-loaded-tip :line="false" v-if="!this.isLoading" :text="canLoad ? '下拉加载更多': (recommendList.length ? '已加载全部' : '')"></qh-loaded-tip>
					</view>
				</qh-scroll-view>
			</view>
		</view>
		<!-- 规格 -->
		<block v-if="showSelectSku">
			<choose-sku :sku="sku" :goodsinfo="goods" :skuselect="skuSelect" :skutype="1" @close="closeSku"></choose-sku>
		</block>

		<block v-if="customer_service==1">
			<view class="tel" @tap="call">
				<image :src="telImg"></image>
			</view>
		</block>
		<block v-else-if="customer_service==2">
			<!-- #ifdef MP-WEIXIN -->
			<button class="support" open-type="contact">
				<image :src="supportImg"></image>
			</button>
			<!-- #endif -->
			<!-- #ifdef MP-ALIPAY -->
			<view class="tel" @tap="call">
				<image :src="telImg"></image>
			</view>
			<!-- #endif -->
		</block>
		<!-- 红包 -->
		<view class="container" v-if="reward">
			<view class="box">
				<image src="https://safood.supplyocta.com/Public/MallSmallApp/reward-bg.png" class="reward-bg"></image>
				<view @tap="toOpen" :class="'reward-open ' + (rotate?'reward-rotate':'')">
					<image v-if="rotate" src="https://safood.supplyocta.com/Public/MallSmallApp/open-1.png"></image>
					<image v-else src="https://www.xzthealth.com/Public/MallSmallApp/open.png"></image>
				</view>
				<view class="reward-money" v-if="open">
					<text>￥</text>
					<text>{{money}}</text>
				</view>
				<view class="reward-tip" v-if="!open">恭喜发财，大吉大利！</view>
				<view class="reward-tip" v-else>已放入会员卡余额</view>
				<view @tap="closeReward" class="reward-close">
					<icon type="cancel" size="30" color="#ffffff"></icon>
				</view>
			</view>
		</view>
		<!-- #ifdef MP-WEIXIN -->
		<official-account @load="bindloads" @error="binderrors" class="accounts"></official-account>
		<!-- #endif -->
		<!-- 新手引导 -->
		<view class="container" v-if="newPeople" @tap="newNext">
			<view
				:class="'people-box ' + (peopleIndex == 2?'second-box':'') + ' ' + (peopleIndex == 3?'third-box':'') + ' ' + (peopleIndex == 4?'four-box':'')">
				<view :class="peopleIndex == 1 || peopleIndex == 2?'arrow-image':'arrow-image-two'">
					<image v-if="peopleIndex == 1 || peopleIndex == 2" class="people-arrow" src="/static/images/people-left.png"></image>
					<image v-else class="people-arrow" src="/static/images/people-right.png"></image>
				</view>
				<view class="people-txt">
					<text v-if="peopleIndex == 1">点击查看门店详细地址</text>
					<text v-if="peopleIndex == 2">点击切换门店</text>
					<text v-if="peopleIndex == 3">扫码购</text>
					<text v-if="peopleIndex == 4">付款码</text>
				</view>
				<image class="people-button" src="https://www.xzthealth.com/Public/MallSmallApp/people-know.png"></image>
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp().globalData;
	import qhScrollMixin from "@/components/qh-scroll-view/mixins.js";
	export default {
		mixins: [qhScrollMixin], // 使用mixin
		components: {
			// #ifdef APP-PLUS
			sendCoupon
			// #endif
		},
		props: {
			templateData: {
				type: Object,
				default () {
					return {}
				}
			}
		},
		data() {
			return {
				isRefresh: false,
				peopleIndex: 1, //新手引导
				newPeople: false, //新手引导
				storeList: [], //门店列表
				couponList: [], //优惠券列表
				mercouponList: [], //微信商家优惠券列表
				pay_coupon: [], //微信代金券列表
				send_coupon_params: [{
					"stock_id": "",
					"out_request_no": "",
				}], //微信券参数
				sign: '', //微信券参数
				send_coupon_merchant: "", //微信券参数
				couponIndex: "", //商家券的领取触发点击事件前的index
				recommendList: [], //推荐商品列表
				recommendPage: 1, //推荐商品分页
				telImg: "/static/images/icon-tel.png", //拨打电话的图标
				supportImg: "/static/images/icon-support.png", //已选门店下标
				goods: {}, //待选择规格的商品信息
				customer_service: 0, // 客服类型  1电话  2微信客服
				canLoad: true, //推荐商品是否可以加载
				isLoading: false, //推荐商品是否正在加载
				act_count: 0, //用来判断页面拼团、秒杀、礼品卡、预售活动排版
				group_list: [], //拼团列表
				advance_list: [],
				seckill_list: [], //秒杀列表
				gift_card_list: [], //礼品卡列表
				navigation: [], //导航栏列表
				showSelectSku: false, //是否显示选择规格弹框
				seckillTimeArr: ['', '', '', ''], //秒杀倒计时显示数组
				seckillTime: 0, //秒杀倒计时
				sku: {},
				liveList: "",
				page: 0,
				user_type: 1,
				imgUrls: "",
				promotion: [],
				newGoodsList: [],
				magic: "",
				phone: "",
				open: false,
				rotate: false,
				reward: false,
				isVip: "",
				money: "",
				skuSelect: [],
				storeName: '主页',
				service_status: '', //商家券  1已获取到服务商下的openid 2未获取到
				webURL: "", //商家券,未获取服务商下的openid,跳转公众号关注获取的url地址
				ordinary_status: '',
				image_header: '',
				store_switch: 1,

				//#ifdef MP-ALIPAY
				canIUse: my.canIUse('mkt'),
				cityCode: '', //用户城市编码
				//#endif
			};
		},
		computed: {
			showBack() {
				return this.$store.merHomeState || this.$store.mallPreviewState
			},
		},
		async mounted() {
			await this.$onLaunched;
			this.image_header = this.$store.image_header
			this.onPageLoad();
			uni.setNavigationBarColor({
				// #ifdef MP-WEIXIN
				frontColor: this.$store.primaryBgTextColor,
				// #endif
				backgroundColor: this.$store.primaryBgColor,
			})
		},

		methods: {
			/**
			 * 生命周期函数--监听页面加载
			 */
			async onPageLoad(options) {
				clearInterval(this.seckillTimer);
			},
			/**
			 * 页面下拉刷新
			 */
			async onPagePullDownRefresh() {
				this.isRefresh = true;
				await this.getBaseData();
				this.isRefresh = false;
				uni.showToast({
					title: '刷新成功',
					duration: 800
				});
			},
			async onShows() {
				await this.$onLaunched;

				const userInfo = uni.getStorageSync('userInfo')

				this.storeList = this.templateData.storeList;
				this.phone = this.templateData.phone;
				this.storeName = this.templateData.storeName;

				this.store_switch = this.templateData.store_switch;
				this.cityCode = this.templateData.cityCode;
				this.store_id = this.templateData.store_id;

				this.newPeople = uni.getStorageSync('newPeopleStorage') == 'true';

				this.user_type = userInfo.type
				let store_id = this.$store.store_id;
				let homeIconArr = uni.getStorageSync('home_icon');
				if (homeIconArr && homeIconArr[store_id]) {
					if (homeIconArr[store_id].home_tel_icon) {
						this.setData({
							telImg: homeIconArr[store_id].home_tel_icon
						});
					}
				}

				this.setData({
					open: false,
					rotate: false
				});
				if (!this.isVip) {
					var isVip = uni.getStorageSync('isVip');

					if (isVip == 1 || userInfo.vid) {
						this.setData({
							isVip: 1
						});
					}
				}

				this.setData({
					page: 1,
				})
				this.getBaseData();
			},
			toStoreLocation() {
				if (this.store_switch == 1) {
					uni.navigateTo({
						url: '/pages/index/storeLocation/storeLocation'
					})
				}
			},
			closeSku() {
				this.setData({
					showSelectSku: false
				})
			},
			// #ifdef MP-WEIXIN
			//是否通过服务商公众号获取到用户openid
			async getServicePermissions() {
				const res = await this.$request('SmallProgramApi/My/getServiceOpenid', {}, false);
				if (res.status == 1) {
					this.service_status = res.data.service_status
					this.ordinary_status = res.data.ordinary_status
				}
			},
			async getLive() {
				const res = await this.$request('SmallProgramApi/ProgramLive/getLiveRoomFind', {}, false);
				if (res.status == 1) {
					this.liveList = res.data;
				}
			},
			seeMoreAnchor() {
				uni.navigateTo({
					url: '/pages/index/lives/lives',
				})
			},

			toLive() {
				let roomId = this.liveList.roomid; // 填写具体的房间号，可通过下面【获取直播房间列表】 API 获取
				let customParams = encodeURIComponent(JSON.stringify({
					path: 'pages/index/index',
					pid: 1
				})); // 开发者在直播间页面路径上携带自定义参数（如示例中的path和pid参数），后续可以在分享卡片链接和跳转至商详页时获取
				uni.navigateTo({
					url: 'plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=' + roomId + '&custom_params=' + customParams
				})
			},
			//领取微信代金券
			async receivePayCoupon(index) {
				const res = await this.$request('SmallProgramApi/PayCoupon/receiveCoupon', {
					id: this.pay_coupon[index].id
				});
				if (res.status == 1) {
					uni.showToast({
						title: res.msg,
						icon: 'success',
						duration: 1000
					})
					this.pay_coupon[index].isget = true;
				} else {
					uni.showToast({
						title: res.msg,
						icon: 'none',
						duration: 2000
					})
				}
			},

			//领取商家券,触发冒泡事件拿到该商家券的ID
			getcouponid(index) {
				this.couponIndex = index;
			},
			//领券后调用的事件-微信商家券
			async getcoupons(params) {
				if (params.detail.send_coupon_result[0].code == "SUCCESS") {
					const res = await this.$request('SmallProgramApi/ShopCoupon/receiveCouponCallback', {
						coupon_id: this.mercouponList[this.couponIndex].id,
						stock_id: params.detail.send_coupon_result[0].stock_id,
						coupon_code: params.detail.send_coupon_result[0].coupon_code,
					})
					uni.showToast({
						title: "领券成功",
						duration: 2000
					});
					this.mercouponList[this.couponIndex].isget = true;

				} else {
					uni.showToast({
						title: params.detail.send_coupon_result[0].message,
						icon: 'none',
						duration: 2000
					});
				}
			},
			//跳转公众号
			showAccount(type) {
				const userInfo = uni.getStorageSync('userInfo')
				let uid = userInfo.uid;
				let backPage = getCurrentPages();
				let page = (backPage[backPage.length - 1]).route.toString()
				uni.navigateTo({
					url: '/pages/index/web/web?url=' + this.webURL + '&uid=' + uid + '&page=' + page + '&user_type=' + type
				})
			},
			//查看优惠券详情
			toCouponDetail(id, isget, genre) {
				uni.navigateTo({
					url: "/pages/index/merCouponDetail/merCouponDetail?id=" + id + '&type=1' + '&isget=' + isget + '&genre=' + genre
				})
			},
			//关注公众号
			bindloads(res) {},
			binderrors(res) {},
			// #endif

			//秒杀计时器
			//新手引导
			newNext() {
				var index = this.peopleIndex;
				if (index < 4) {
					if (this.store_switch == 2 && index == 1) {
						index += 2
					} else {
						index++;
					}
					this.setData({
						peopleIndex: index
					});
				} else {
					uni.setStorageSync('newPeopleStorage', 'false');
					this.setData({
						newPeople: false,
					});
				}
			},
			//点击进入门店地图
			goStoreAddress() {
				var storeList = this.storeList;
				uni.openLocation({
					longitude: Number(storeList[0].longitude),
					latitude: Number(storeList[0].latitude),
					name: storeList[0].store_name,
					address: storeList[0].address
				});
			},
			// 首页点击搜索
			search() {
				uni.navigateTo({
					url: '/pages/product/productList/productList?type=1'
				});
			},
			//拨打电话
			call() {
				var phone = this.phone;

				if (!phone) {
					uni.showToast({
						title: '门店未设置电话',
						icon: 'none'
					});
					return;
				}

				uni.makePhoneCall({
					phoneNumber: phone
				});
			},

			//点击添加购物车
			async addToCar(index) {
				this.sku.canChangeCarNum = 1;

				if (this.recommendList[index].attribute_state == 2) {
					this.sku.shoppingNum = 1;
					this.goods = this.recommendList[index]
					this.showSelectSku = true;
				} else {
					const res = await this.$mutations.setShoppingCar({
						goods_id: this.recommendList[index].goods_id,
						num: 1,
						fixed_num: this.sku.canChangeCarNum == 1 ? 0 : 1, //是否不可修改数量
						goods_type: 2,
					});
					if (res) {
						this.sku.canChangeCarNum = 1;
						this.sku.canChangeAddNum = true;
						this.showSelectSku = false;
					}
				}
			},
			//礼品卡首页
			toGiftCard() {
				uni.navigateTo({
					url: '/pages/mine/gift_home/gift_home'
				});
			},
			//礼品卡详情
			toGiftdetail(id) {
				uni.navigateTo({
					url: '/pages/mine/gift_purchase/gift_purchase?id=' + id
				});
			},
			//促销商品列表
			toPromotion() {
				uni.navigateTo({
					url: '/pages/product/promotion/promotion'
				});
			},
			//最新商品列表
			toNewGoods() {
				uni.navigateTo({
					url: '/pages/product/new-goods/new-goods'
				});
			},
			//会员卡页面
			toCard() {
				uni.navigateTo({
					url: '/pages/mine/card/card?type=1'
				});
			},
			//拼团首页
			toGroup() {
				uni.navigateTo({
					url: '/pages/index/Group-purchase/Group-purchase'
				});
			},
			//拼团商品详情
			toGroupdetail(id) {
				uni.navigateTo({
					url: '/pages/index/Group-purchase-details/Group-purchase-details?id=' + id
				});
			},
			//预售首页
			toAdvance() {
				uni.navigateTo({
					url: '/pages/index/advanceSale/advanceSale'
				});
			},
			//预售商品详情
			toAdvanceDetail(id) {
				uni.navigateTo({
					url: '/pages/index/advanceDetails/advanceDetails?id=' + id
				});
			},
			//秒杀商品详情
			toSeckilldetail(id) {
				uni.navigateTo({
					url: '/pages/index/Seckill-purchase-details/Seckill-purchase-details?id=' + id
				});
			},
			//秒杀首页
			toSeckill() {
				uni.navigateTo({
					url: '/pages/index/Seckill-purchase/Seckill-purchase'
				});
			},
			//跳转优惠券
			coupon() {
				uni.navigateTo({
					url: '/pages/index/Coupon/Coupon'
				});
			},
			//扫条形码
			scavenging() {
				uni.scanCode({
					success: async (re) => {
						if (re.errMsg != 'scanCode:ok') return;
						const res = this.$request('SmallProgramApi/Goods/scavenging_v1', {
							goods_code: re.result,
						});
						if (res.status != 1) return uni.showToast({
							title: res.msg,
							icon: 'none'
						});
						this.sku.skuPrice = res.goods.online_price;
						this.sku.skuImg = res.goods.goods_img;
						this.sku.canChangeCarNum = res.canChangeCarNum;
						if (res.goods.goods_num) {
							this.sku.skuNum = parseFloat(res.goods.goods_num)
						}
						this.sku.skuShopMemPrice = parseFloat(res.goods.shop_mem_price); //商品普通会员价
						this.sku.skuShopMemStatus = res.goods.shop_mem_status; //规格商品是否开启普通会员价  1开启  2关闭
						this.sku.skuPlusMemStatus = res.goods.plus_mem_status; //规格商品是否开启PLUS会员价  1开启  2关闭
						this.sku.skuPlusPrice = res.goods.plus_price; //规格商品PLUS会员价

						if (res.goods.attribute_state == 2) {
							this.sku.shoppingNum = 1;
							this.sku.sku_promotion_status = 0;
							this.sku.promotion_price = 0;

							this.skuSelect = res.skuSelect ? res.skuSelect : [];
						} else {
							this.sku.skuName = res.goods.goods_name;
							this.sku.isSku = false;
							this.sku.shoppingNum = res.canChangeCarNum != 1 ? res.num : 1;
							this.sku.sku_promotion_status = res.promotion_status;
							this.sku.promotion_price = res.promotion_price;
							this.sku.skuList = [];
						}
						this.goods = res.goods;

						setTimeout(() => {
							this.showSelectSku = true;
						}, 0)
					}
				});
			},

			//更多商品
			productList() {
				uni.navigateTo({
					url: '/pages/product/productList/productList'
				});
			},
			//商品详情
			details(id) {
				uni.navigateTo({
					url: '/pages/product/details/details?id=' + id
				});
			},
			//处理数量不足的数组
			handleList(list, len) {
				var arr = list;

				if (list.length < len) {
					var l = len - list.length;

					for (var i = 0; i < l; i++) {
						arr.push({
							id: 0
						});
					}
				}

				return arr;
			},
			//秒杀倒计时
			reCountSeckillTime() {
				clearInterval(this.seckillTimer);
				var seckillTimeArr = ['', '', '', ''];
				this.seckillTimer = null;
				var seckillTime = 0;
				this.setData({
					seckillTimeArr: seckillTimeArr,
					//秒杀倒计时显示数组
					seckillTime: seckillTime //秒杀倒计时

				});

				if (this.seckill_list.length && this.seckill_list[0].id > 0) {
					seckillTime = this.seckill_list[0].time;
					this.seckillTimer = setInterval(() => {
						seckillTime--;

						if (seckillTime == 0) {
							clearInterval(this.seckillTimer);
							seckillTimeArr = ['', '', '', ''];
							this.setData({
								seckillTimeArr: seckillTimeArr,
								seckillTime: seckillTime
							});
							this.getHomeData();
						} else {
							var arr = getApp().globalData.getDayHis(seckillTime * 1000);
							this.setData({
								seckillTimeArr: arr,
								seckillTime: seckillTime
							});
						}
					}, 1000);
				}
			},
			//获取首页拼团，秒杀，礼品卡，付款码，客服、预售
			async getHomeData() {
				const res = await this.$request('SmallProgramApi/BaseSet/getHomeData_v2', {}, false);
				if (res.status == 1) {
					var act_count = 0;
					if (res.group_list.length > 0) {
						act_count += 1;
						res.group_list = this.handleList(res.group_list, 3);
					} else {
						res.group_list = [];
					}

					if (res.seckill_list.length > 0) {
						act_count += 1;
						res.seckill_list = this.handleList(res.seckill_list, 3);
					} else {
						res.seckill_list = [];
					}

					if (res.gift_card_list.length > 0) {
						act_count += 1;
						res.gift_card_list = this.handleList(res.gift_card_list, 2);
					} else {
						res.gift_card_list = [];
					}

					if (res.advance_list.length > 0) {
						act_count += 1;
						res.advance_list = this.handleList(res.advance_list, 3);
					} else {
						res.advance_list = [];
					}
					/*客服图标*/
					if (res.icon) {
						var home_icon = uni.getStorageSync('home_icon');
						home_icon = home_icon ? home_icon : [];
						home_icon[this.$store.store_id] = res.icon;
						uni.setStorageSync('home_icon', home_icon);
					}
					this.setData({
						customer_service: res.customer_service ? res.customer_service : 2,
						group_list: res.group_list,
						seckill_list: res.seckill_list,
						gift_card_list: res.gift_card_list,
						advance_list: res.advance_list,
						phone: res.phone,
						supportImg: res.icon.home_support_icon ? res.icon
							.home_support_icon : "/static/images/icon-support.png",
						// 微信客服
						telImg: res.icon.home_tel_icon ? res.icon.home_tel_icon : "/static/images/icon-tel.png", // 拨打电话
						act_count: act_count
					});
					this.reCountSeckillTime(); //秒杀倒计时
				} else {
					uni.showToast({
						title: res.msg ? res.msg : '请求发生错误',
						mask: false
					});
				}
			},

			//获取券基本数据
			async getCoupon() {
				const res = await this.$request('SmallProgramApi/Coupon/getSomeCoupon', {}, false);
				if (res.status == 1) {
					let mercouponList = res.shop_coupon;
					let pay_coupon = res.pay_coupon;
					mercouponList.forEach((item, index) => {
						item.isget = false
					});
					pay_coupon.forEach((item, index) => {
						item.isget = false
					})
					this.couponList = res.data;
					this.mercouponList = mercouponList;
					this.webURL = res.web_url;
					this.pay_coupon = pay_coupon;
				} else {
					this.couponList = [];
					this.mercouponList = [];
					this.pay_coupon = [];
				}

				this.sku.user_type = res.user_type ? res.user_type : 1;
				this.user_type = res.user_type;
			},
			//获取基本信息
			async getBaseData() {
				if (this.storeList.length == 0) return;
				this.storeInfo = this.storeList[0];
				this.store_id = this.storeList[0].store_id;
				uni.setStorageSync('storeInfo', this.storeList[0]);

				await this.getReward();

				await this.getHomeData();

				// #ifdef MP-WEIXIN
				await this.getServicePermissions();
				await this.getLive();
				// #endif

				if (getApp().globalData.loginState()) {
					await this.getCoupon();
				}

				//导航栏
				const nav = await this.$request('SmallProgramApi/BaseSet/getNavigation', {
					subPackages: 1
				}, false);
				this.navigation = nav.status == 1 ? nav.data : [];

				//轮播图
				const banner = await this.$request('SmallProgramApi/BaseSet/storeBanner', {
					subPackages: 1
				}, false);
				this.imgUrls = banner.status == 1 ? banner.banner : [];

				//推荐商品
				this.recommendPage = 1;
				this.canLoad = true;
				this.isLoading = false;
				await this.getRecommend();

				//最新商品
				const goodsRes = await this.$request('SmallProgramApi/Goods/getPromotionAndNewGoods_v2', {}, false);
				this.promotion = goodsRes.status == 1 && goodsRes.promotion.length > 0 ? this.handleList(goodsRes.promotion, 3) : [];
				this.promotion = goodsRes.status == 1 && goodsRes.newGoodsList ? goodsRes.newGoodsList : [];

				//魔方
				const magic = await this.$request('SmallProgramApi/Goods/getMagicCube', {}, false);
				this.magic = magic.status == 1 ? magic.magic : [];
			},

			//商家推荐商品
			async getRecommend() {
				if (!this.canLoad || this.isLoading) return;
				this.isLoading = true;

				const res = await this.$request('SmallProgramApi/Goods/getSellGoods_v1', {
					page: this.recommendPage,
					needLogin: false
				}, false);
				if (res.status != 1) return;
				if (this.recommendPage != 1) {
					//第一页
					this.recommendList.push.apply(this.recommendList, res.info);
				} else {
					this.recommendList = res.info;
				}
				this.recommendPage++;

				this.canLoad = res.info.length < res.limit || !res.info.length ? false : true;
				this.isLoading = false;
			},
			//查找红包
			async getReward() {
				this.setData({
					open: false,
					rotate: false
				});
				const res = await this.$request('SmallProgramApi/Reward/getHomeReward', {}, false);

				if (res.status == 1) {
					//红包
					this.setData({
						reward: true,
						isVip: userInfo.vid ? 1 : 0
					});
				}
			},
			//导航栏跳转
			toNavigation(url) {
				uni.navigateTo({
					url: url
				});
			},
			//轮播图片跳转
			toImgUrl(url) {
				if (url) {
					uni.navigateTo({
						url: url
					})
				}
			},
			//拆红包
			async toOpen() {
				if (!this.rotate) {
					if (this.isVip != 1) return uni.showModal({
						title: '温馨提示',
						content: '您没有激活会员卡，去激活会员领取红包吧！',
						showCancel: true,
						cancelText: '狠心放弃',
						confirmText: '去激活',
						success: (res) => {
							if (res.confirm) {
								uni.navigateTo({
									url: '/pages/mine/card/card'
								});
							}
						}
					});

					this.rotate = true;
					const res = await this.$request('SmallProgramApi/Reward/openHomeReward');
					if (res.status == 1) {
						this.money = res.money;
						this.open = true;
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none',
							duration: 1500
						});
						this.closeReward();
					}
				}
			},
			//关闭拆红包
			closeReward() {
				this.reward = false;
			},
			//魔方详情
			toMagicDetail(url) {
				uni.navigateTo({
					url: url
				});
			},
			//领取优惠券
			async receiveCoupon(index) {
				const res = await this.$request('SmallProgramApi/Coupon/collar', {
					coupon_id: this.couponList[index].id
				})
				if (res.status == 1) {
					this.couponList[index].use = true;
					uni.showToast({
						title: '领取成功',
						duration: 1000,
						mask: false
					});
				} else {
					uni.showToast({
						title: '领取失败',
						duration: 1000,
						icon: 'none',
						mask: false
					});
				}
			},

			// 返回
			goBack() {
				uni.redirectTo({
					url: '/pages/district/district'
				})
			},

			// 展示plus会员价条件
			showPlusPrice(item) {
				return app.showPlusPrice(item)
			},

			// 展示会员价条件
			showVipPrice(item) {
				return app.showVipPrice(item)
			},

			// 展示普通价格
			showOnlinePrice(item) {
				return app.showOnlinePrice(item)
			},

		},

		filters: {
			getdate(value) {
				let val = value.split(' ');
				return val[0]
			}
		}

	};
</script>
<style lang="less">
	@import url("./define_template.less");

	.define-template {
		width: 100%;
		height: 100%;
		overflow: hidden;

		.box {
			height: 768rpx;
			margin: 0 auto;
		}

		.home-map-icon {
			font-size: 36rpx;
			padding: 0 10rpx;
			color: #FFFFFF;
		}

		.home-nomoral {
			border-radius: 10rpx;
		}

		.home-nav {
			border-radius: 10rpx;
		}

		.home-act-list-left {
			width: 220rpx;
		}

		.home-act-list-item {
			width: 132rpx;
		}

		.gift-icon {
			width: 88rpx;
			height: 88rpx;
			position: absolute;
			top: 0;
			left: 0
		}

		.commission {
			background-color: #ffeded;
			box-sizing: border-box;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
			font-size: 20rpx;
			color: #333;
			margin: 10rpx 0px 10rpx 8rpx;
			text-align: center;
			padding: 8rpx 2rpx;
			border-radius: 8rpx;
			width: 70%;
		}
	}
</style>
